<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>消息中心</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../css/base.css"/>
    <link rel="stylesheet" type="text/css" href="../css/common.css"/>
    <style>
    	html,body{
    		background: #fff;
    	}
    	#jqm-message dl dt{
    		    color: #333;
    		    font-size: 16px;
    	}
    	#jqm-message dl dd{
    	    color: #666;
    	    font-size: 14px;
    	    
			white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
    	}
    	#jqm-message{
    		width: 100%;
    		position: relative;
			display: block;
			overflow: hidden;
			
		}
		#jqm-message dl{
			margin-left:10px;
			padding: 10px 0px;
			position: relative;
			display: block;
			overflow: hidden;
			width: 100%;
		}
		#jqm-message .item-left{
			float: left;
			padding-right:10px;
			display: block;
			position: relative;
			
		}
		#jqm-message .item-right{
			width:75%;
			float: left;
			
		}
		#jqm-message img{
		    margin-top: 2px;
		    }
		    #jqm-message .item-time{
		    	position:absolute;
		    	right: 18px;
		    	top: 10px;
		    	color: #848689;
		    	font-size: 12px;
		    }
		    #jqm-message i {
		    	position: absolute;
		    	top: 0px;
		    	right: 2px;
		    	background: url(../image/message_red_icon.png)no-repeat center center;
		    	background-size: 20px;
				width: 20px;
				height: 20px;
		    }
    </style>
</head>
<body>
	<div id='jqm-message'>
		<dl id='dl1' class="border-bottom-img" >
			
			<div class="item-left">
				<i id='i-message' style="display: none"></i>
				<img src="../image/lotterymessage.png" width="35px" height="35px"/>
			</div>
			<div class="item-right">
				<dt>揭晓通知</dt><span id='time2' class="item-time"></span>
				<dd id='title2'>您还未收到揭晓通知。</dd>
			</div>
			
		</dl>
		<dl id='dl2' class="border-bottom-img" >
			
			<div class="item-left">
				<i id='i-message2' style="display: none"></i>
				<img src="../image/winmessage.png" width="35px" height="35px"/>
			</div>
			<div class="item-right">
				<dt>中奖通知</dt><span id='time3' class="item-time"></span>
				<dd id='title3'>您还未收到揭晓通知。</dd>
			</div>
			
		</dl>
		
		<dl  class="border-bottom-img" onclick='openHeader("systemMessage")'>
			<div class="item-left">
				<img src="../image/systemmessage.png" width="35px" height="35px"/>
			</div>
			<div class="item-right">
				<dt>猫购公告</dt><span id='time' class="item-time">2015.08.16</span>
				<dd id='title'>Hi,机器猫感谢您的使用。</dd>
			</div>
			
		</dl>	
		
	</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
	<script type="text/javascript" src="../script/doT.min.js"></script>
	<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript">
	var uid = null;
	apiready = function(){
	var ah = api.require('ajpush');
				ah.setBadge({
				    badge:0
				});
	api.addEventListener({
    name: 'myread'
}, function(ret, err) {
    if(ret.value['read']=='Y'){
    	$api.css($api.byId('i-message'),'display:none');
    }
});

		uid = $api.getStorage('user').uid;
		api.ajax({
	        url:'http://wap.jqmao.cn/getSystemMessage'
        },function(ret,err){
        	//coding...
        	if(ret){   
				var title = $api.byId('title');
				var time = $api.byId('time');
				$api.html(time, ''+ret.time);
            	$api.html(title, ''+ret.title);
        	}else{
        		////alert(JSON.stringify(err));
        	}
        });
        api.ajax({
	        url:'http://wap.jqmao.cn/getLottMessage?uid='+uid
        },function(ret,err){
        	//coding...
        	if(ret){
        		if(ret.code=='1'){
        			
        			return;
        		}
        		
				var title2 = $api.byId('title2');
				var time2 = $api.byId('time2');
				$api.html(time2, ''+ret.time);
            	$api.html(title2, ''+ret.title);
            	$api.addEvt($api.byId('dl1'), 'click', function(){
            		openHeader("lottMessage");
            	});
            	if(ret.read=='N'){
            		$api.css($api.byId('i-message'),'display:block');
            	}
        	}else{
        		//alert(JSON.stringify(err));
        	}
        });
        api.ajax({
	        url:'http://wap.jqmao.cn/getLottMessage?uid='+uid+'&t=2'
        },function(ret2,err){
        	//coding...
        	if(ret2){
        	
        	
        		if(ret2.code=='1'){
        			
        			return;
        		}
        		
				var title3 = $api.byId('title3');
				var time3 = $api.byId('time3');
				$api.html(time3, ''+ret2.time);
            	$api.html(title3, ''+ret2.title);
            	$api.addEvt($api.byId('dl2'), 'click', function(){
            		openHeader("winMessage");
            	});
            	if(ret2.read=='N'){
            
            		$api.css($api.byId('i-message2'),'display:block');
            	}
        	}else{
        		//alert(JSON.stringify(err));
        	}
        });
        
        
		
	};
</script>
</html>